import {addEvent, stopBubble} from "./commonTool.js"; // 导入自己封装的工具函数

/**
 * 定义一个计算器的类
 */
export class Calculator {
    constructor(showText, expression){
        this.showText = showText; // 用于展示的数字
        this.expression = expression; // 用户点击生成的表达式
        
        // 整个计算器外层包裹的容器
        this.divContainer = document.getElementsByClassName("container")[0];
        this.isPreviousEnd = false;  // 上一次计算刚刚结束的标记
        this.previousResult = 0;  // 上一次计算的结果的缓存
        this.isStart = false; // 控制开始结束的标记
    }
    init() {
        this.render();
        this.eventAdd();
    }

    // 为所有按钮的父元素绑定点击事件，使用事件委托的方式
    eventAdd(){
        const that = this;
        const startLi = document.getElementsByClassName('start')[0]; // 开始的按钮
        const stopLi = document.getElementsByClassName('stop')[0];  // 结束的按钮
        // 给开始按钮绑定点击事件
        addEvent(startLi, 'click', function(e) {
            that.isStart = true;
            const event = e || window.event;
            stopBubble(event);
        })
        // 给结束按钮绑定点击事件
        addEvent(stopLi, 'click', function(e) {
            that.isStart = false;
            const event = e || window.event;
            stopBubble(event);
        })
        // 给所有的功能按钮的父元素绑定点击事件
        addEvent(this.divContainer, 'click', function(e){
            if(that.isStart) {
                const event = e || window.event;
                const target = event.target || event.srcElement;
                if(target.nodeName === 'LI') { // 说明点击的是li元素，也是我们的功能按钮
                    const contentStr = target.innerHTML; // 通过点击的li的内容判断点击的是哪一个键
                    const number = parseInt(contentStr);
                    if(Object.is(number, NaN)) { // 点击的不是数字，因为转换成了NaN
                        // 点击的是操作符
                        if(contentStr === '=') {
                            try{
                                that.expression = eval(that.expression.replace(/÷/g, '/').replace(/×/g, '*')) + '';
                                that.previousResult = that.expression;                 
                                that.isPreviousEnd = true;
                                that.showText = that.expression;
                                that.render(); 
                            }catch(e){
                                alert("输入的表达式不符合要求！！！");
                            }
                            return;
                        }else if(contentStr === '+' || contentStr === '-' || contentStr === '×' || contentStr === '÷' || contentStr === '.'){
                            that.expression += contentStr;
                            that.isPreviousEnd = false;
                        }else if(contentStr === '归零') {
                            that.expression = '0';
                            that.isPreviousEnd = false;
                        }else if(contentStr === '缓存') {
                            that.expression = that.previousResult;
                            that.isPreviousEnd = true;
                        }
                        that.showText = that.expression;
                        that.render(); 

                    }else{
                        // 点击的是数字
                        if(that.showText === '0') {
                            that.expression = number + '';
                            that.isPreviousEnd = false;
    
                        }else if(that.isPreviousEnd){
                            that.expression = number + '';
                            that.isPreviousEnd = false;
                        }else{
                            that.expression += number;
                        }
                        
                        that.showText = that.expression;
                        that.render();
                    }
                }
            }
        });
    }

    // 把数据渲染到页面
    render() {
        // console.log(this.expression);
        // console.log(this.showText);
        const showDiv = document.getElementsByClassName('show')[0]
        const inputEle = showDiv.getElementsByTagName('input')[0];  // 展示数据的元素
        inputEle.value = this.showText; 
    }
}

